<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8">
    <title>layui</title>
    <meta name="renderer" content="webkit">
    <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
    <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">

	<link rel="stylesheet" href="../../../static/font-awesome-4.7.0/css/font-awesome.min.css" >
    <link rel="stylesheet" href="../../../static/vui/css/vui.css">

    <script type="text/javascript" src="../../../static/js/jquery-1.9.1.min.js"></script>
    <script type="text/javascript" src="../../../static/js/jquery.cookie.min.js"></script>
    <script type="text/javascript" src="../../../static/layer/layer.js"></script>
    <script type="text/javascript" src="../../../static/vui/js/vui.js"></script>
	<script type="text/javascript" src="../../../static/vui/js/reportgrid.js"></script>
    <script type="text/javascript" src="../../../static/js/common.js"></script>
</head>
<body>

	<div id="formArea">
		<table class="table-top">
			<tr>
				<td>
					<label class="label">所属机构</label>
				</td>
				<td>
					<div id="companyId"></div>
				</td>
				<td>
					<label class="label">仓库</label>
				</td>
				<td>
					<div id="stoneId"></div>
				</td>
                <td>
                    <label class="label">商品</label>
                </td>
                <td>
                    <div id="productId"></div>
                </td>
                <td>
                    <button class="button" id="query"><span>查询</span></button>
                    <button class="button" id="reset"><span>重置</span></button>
                </td>
			</tr>
		</table>

	</div>

    <div class="report-table-div">
        <table id="table" class="report-table">
            <tr class="report-head">
                <td rowspan="2">商品名称</td>
                <td rowspan="2">商品编码</td>
                <td rowspan="2">商品条码</td>
                <td rowspan="2">规格型号</td>
                <td rowspan="2">单位</td>
            </tr>
            <tr class="report-head">
            </tr>
        </table>
    </div>


<script>
    $(function(){
        app.request({
            url:'store/select',
            data:{},
            success:function (resp) {
                initStorePage(resp);
            }
        });
    });

    function initStorePage(resp) {
        $('#query').click(function(){
            var productComplex = $('#productId input[name="productId_text"]').val();
            var data = app.serializeForm();
            data.productComplex = productComplex;
            $('#table').reportgrid("reload",data);
        });

        $('#reset').click(function(){
            $('#formArea input').val('');
            var company = {companyId:app.getCompanyId(),companyId_text:app.getCompanyName()};
            app.resetForm(company);
        });

        var columns = [
            {field:'productName',title:'商品名称',width:100},
            {field:'code',title:'商品编码',width:80},
            {field:'barcode',title:'商品条码',width:120},
            {field:'model',title:'规格型号',width:100},
            {field:'unitName',title:'单位',width:50}
            /*{field:'oneprice',title:'库存单位成本（元）',n:'money',width:100,fixed:true,formatter:function (row) {
                    if(row.number==0){
                        return '0.00';
                    }
                    return app.mul(app.div(row.price,row.number),app.DIV) ;
                }}*/
        ];

        var stores = [];
        for( var i=0 ; i<resp.data.length ; i++ ){
            $('#table .report-head').eq(0).append('<td create="on" colspan="3">'+resp.data[i].name+'</td>');
            $('#table .report-head').eq(1).append('<td create="on">库存数量</td><td create="on">库存成本</td><td create="on">成本单价</td>');
            stores.push(resp.data[i].name);
        }

        $('#table').reportgrid({
            //width:1000,
            pagination:false,
            url:app.BASE_API_URL+'storeProduct/page',
            queryParams:{companyId:app.getCompanyId()},
            columns:mergeColumns(columns,stores)
        });

        $('#stoneId').combobox({
            data:resp.data,
            valueField:'id',textField:'name',
            name:'storeId'
        });

        $('#companyId').search({
            name:'companyId',
            click:function(){
                app.window(layer,{
                    btn:[],
                    area: ['600px', '450px'],
                    content: '../../common/company_tree.html?index=-1&searchId=companyId',
                    end:function () {

                        //setStoreData($('#companyId input[name="companyId"]').val());
                    }
                });
            }
        });

        var company = {companyId:app.getCompanyId(),companyId_text:app.getCompanyName()};
        app.resetForm(company);

        $('#productTypeId').search({
            name:'productTypeLogicalCode',
            click:function(){
                var index = parent.layer.getFrameIndex(window.name);
                app.window(parent.layer,{
                    title:'商品分类选择',
                    btn:[],
                    area: ['500px', '500px'],
                    content: './html/common/productype_tree.html?index='+index+'&queryId=productTypeId&idField=logicalCode'
                });
            }
        });

        $('#productId').search({
            id:"productId",
            name:'productId',
            click:function(){
                // this click before blur
                var index = layer.getFrameIndex(window.name);
                app.window(layer,{
                    title:'商品选择',
                    btn:[],
                    area: app.productArea,
                    content: '../../common/product_list_query.html?index='+index+'&searchId=productId'
                });
            }
        });
    }

    function mergeColumns(columns,stores) {
        var merges = [];
        //var stores = ['总部仓库','www'];
        for( var i=0 ; i<stores.length ; i++ ){
            merges.push({field:'a'+i,title:'库存数量',n:'number',owner:stores[i],width:80,index:1,formatter:mergeFormatter});
            merges.push({field:'b'+i,title:'库存成本',n:'money',owner:stores[i],width:100,index:2,formatter:mergeFormatter});
            merges.push({field:'c'+i,title:'单价成本',n:'money',owner:stores[i],width:80,index:3,formatter:mergeFormatter});
        }
        return columns.concat(merges);
    }

    function mergeFormatter(row,val,col) {
        var values = row['storeName'].split(',');
        for( var i=0 ; i<values.length ; i++ ){
            var value = values[i];
            if( value.indexOf(col.owner) != -1 ){
                return value.split('|')[col.index];
            }
        }

        return '';
    }
</script>
</body>
</html>